<template>
  <div class="wb bg_fff fl vc bkra8 pad_12">
    <div class="fls">
      <van-image
        width="48px"
        height="48px"
        radius="5px"
        lazy-load
        fit="cover"
        v-if="item.storeImg"
        :src="item.storeImg"
      />
      <img src="@/assets/images/icon_store.png" class="img48 bkra5" v-else />
    </div>
    <div class="pdl_12 fl1 flau">
      <div class="fl vc">
        <div class="fl vc fl1 flau pdr_10">
          <p class="ct dx_15">{{ item.storeName }}</p>
          <img src="@/assets/images/left_triangle_icon.png" class="w23 fls ml5" />
        </div>
        
        <p 
          class="dx_15 fls"
          :class="
            item.bindStatus == 20
              ? 'color_success'
              : item.bindStatus == 30
              ? 'color_fail'
              : item.bindStatus == 10 ||
                item.bindStatus == 17 ||
                item.bindStatus == 5
              ? 'color_warning'
              : 'color_cancel'
            "
          >{{ formatterStatus(item.bindStatus, bindStatusOptions) }}</p>
      </div>
      <div class="fl vc mt5">
        <span class="dx_14 color_8c fls">绑定剧本</span>
        <span class="dx_15 color_333 fl1 omit">【{{ item.scriptTitle }}】</span>
      </div>
    </div>
  </div>
</template>

<script>
import { bindStatusOptions, payStatusOptions } from '@/config/config'
import { formatterStatus, fnOmit } from '@/utils/util'
export default {
  components: {
  },

  props: {
    item: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      fnOmit,
      formatterStatus,
      bindStatusOptions,
      payStatusOptions,
    };
  },

  methods: {

  }
};
</script>

<style lang="less">

</style>
